<template>
 <div>
    <input type="text" placeholder="enter the name you search" v-model="keyWord">
    <button @click="searchUsers">Search</button>
 </div>
</template>

<script>
import axios from 'axios'
export default {
  name: 'Search',
  data() {
   return {
     keyWord: ''
   }
  },
  methods: {
    searchUsers() {
      if(!this.keyWord.trim()) return;
      this.$bus.$emit('updateListData', {isFirst: false, isLoading: true, errMsg: '', users: []})
      axios.get('https://api.github.com/search/users?q=' + this.keyWord).then(response => {
        console.log('请求成功了', response.data)
        const data = response.data
        this.$bus.$emit('updateListData', {isLoading: false, errMsg: '', users: data.items})
      }, error => {
        console.log('请求失败了', error.message)
        this.$bus.$emit('updateListData', {isLoading: false, errMsg: error.message, users: []})
      })
    }
  }
}
</script>
